import { useEffect, useState } from "react";
import { Select, SelectOption, SelectValue } from "tdesign-react";

/**
 * 字典下拉框
 * @param props 
 * @returns 
 */
const DictSelect: React.FC<{
  name: string;
}> = (props) => {
  const { name, ...args } = props;
  const [value, setValue] = useState("");
  const [loading, setLoading] = useState(false);
  const [options, setOptions] = useState([]);

  // eslint-disable-next-line react-hooks/exhaustive-deps
  useEffect(async() => {
    const data = await loadDictData();
    setOptions(data);
  }, []);

  const loadDictData = () => {
    return new Promise((resolve) => {
      setLoading(true);
      console.log(name);
      setTimeout(() => {
        resolve([
          {
            value: `腾讯_test1`,
            label: `腾讯_test1`,
          },
          {
            value: `腾讯_test2`,
            label: `腾讯_test2`,
          },
          {
            value: `腾讯_test3`,
            label: `腾讯_test3`,
          },
        ]);
        setLoading(false);
      }, 1000);
    });
  };

  const onSearch = () => {
    setLoading(true);
  };

  const onChange = (value: SelectValue) => {
    setValue(value.toString());
  };

  return <Select value={value} onChange={onChange} loading={loading} onSearch={onSearch} options={options} {...args} />;
};

export default DictSelect;
